<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head th:include="include :: header">
</head>
<body class="gray-bg">
	<div class="wrapper wrapper-content ">
		<div class="row">
			<div class="col-sm-12">
				<div class="ibox float-e-margins">
					<div class="ibox-content">
						<form class="form-horizontal m-t" id="signupForm">
							<div class="form-group" style="height: 30px;">
								<label class="col-sm-3 control-label">允许上传：</label>
								<div class="col-sm-2">
									<div class="switchOn switchOff" style="margin-top: 18px;left: 100px;" id="uploadAuthority">
										<em></em>
									</div>
								</div>
							</div>
							<div class="form-group" style="height: 30px;">
								<label class="col-sm-3 control-label">允许下载：</label>
								<div class="col-sm-2">
									<div class="switchOn switchOff" style="margin-top: 18px;left: 100px;" id="downloadAuthority">
										<em></em>
									</div>
								</div>
							</div>
							<div class="form-group">
								<label class="col-sm-3 control-label">授权类型：</label>
								<div class="col-sm-8" style="margin-top: -26px; padding-left: 113px;">
									<input type="radio" name="nameListType" value="1" checked>&nbsp;当前用户&nbsp;&nbsp;&nbsp;
									<input type="radio" name="nameListType" value="2">&nbsp;当前部门&nbsp;&nbsp;&nbsp;
									<input type="radio" name="nameListType" value="3">&nbsp;所有用户
								</div>
							</div>
							<div class="form-group">
								<div class="col-sm-8 col-sm-offset-3">
									<button onclick="authorize();" class="btn btn-primary">确定</button>
								</div>
							</div>
							<input type="hidden" id="userId" th:value="${userId}">
							<input type="hidden" id="uploadAuthority1" th:value="${userDO.uploadAuthority}">
							<input type="hidden" id="downloadAuthority1" th:value="${userDO.downloadAuthority}">
						</form>
					</div>
				</div>
			</div>
		</div>

	</div>
	<div th:include="include::footer"></div>
<script>

	var uploadAuthority1 = $("#uploadAuthority1").val();
	var downloadAuthority1 = $("#downloadAuthority1").val();
	if(uploadAuthority1 != "" && uploadAuthority1 == 0){
		$("#uploadAuthority").attr("class","switchOn")
	}else {
		$("#uploadAuthority").attr("class","switchOn switchOff")
	}
	if(uploadAuthority1 != "" && downloadAuthority1 == 0){
		$("#downloadAuthority").attr("class","switchOn")
	}else {
		$("#downloadAuthority").attr("class","switchOn switchOff")
	}

	var uploadAuthority = 1;
	var downloadAuthority = 1;
	if(uploadAuthority1 != "") {
		uploadAuthority = uploadAuthority1;
		downloadAuthority = downloadAuthority1;
	}
	$(document).on('click','.switchOn',function(){
		$(this).toggleClass('switchOff');
		var switchOn=$(this).attr("class")
		var idShow = $(this).attr("id");
		if(switchOn.indexOf("switchOff") == -1) {
			//开
			if(idShow == "uploadAuthority") {
				uploadAuthority = 0;
			}else if(idShow == "downloadAuthority") {
				downloadAuthority = 0;
			}
		}else {
			//关
			if(idShow == "uploadAuthority") {
				uploadAuthority = 1;
			}else if(idShow == "downloadAuthority") {
				downloadAuthority = 1;
			}
		}
	});

	function authorize() {
		var userId = "";
		var deptId = "";
		var nameListType = $("input[name='nameListType']:checked").val();
		if(nameListType == null || nameListType == "") {
			parent.layer.msg("请选择授权类型");
			return;
		}
		if(nameListType == "1") {
			userId = $("#userId").val()
			deptId = "";
		}else if(nameListType == "2") {
			userId = $("#userId").val()
			deptId = "1";
		}else if(nameListType == "3") {
			userId = "";
			deptId = "";
		}
		$.ajax({
			type : 'POST',
			data : {
				"userId" : userId,
				"deptId" : deptId,
				"uploadAuthority":uploadAuthority,
				"downloadAuthority":downloadAuthority
			},
			url : '/sys/user/batchAuthorize',
			async : false,
			success : function(data) {
				if (data.code == 0) {
					var index = parent.layer.getFrameIndex(window.name); // 获取窗口索引
					parent.layer.close(index);
					parent.layer.msg("操作成功");
					parent.reLoad();
				} else {
					parent.layer.alert(data.msg)
				}
			}
		});
	}

</script>
</body>
</html>

<style type="text/css">
	.panel-body{
		position: relative;
	}
	*{
		margin: 0px;
		padding: 0px;
	}
	.switchOn {
		display: inline-block;
		width: 50px;
		height: 22px;
		border-radius: 22px;
		background-color: #009f3c;
		position: relative;
		vertical-align: top;
		cursor: pointer;
		position: relative;
		top: -45px;
		left: 400px;
	}
	.switchOn em {
		display: inline-block;
		width: 18px;
		height: 18px;
		border-radius:50%;
		background:#FFFFFF;
		position: absolute;
		right: 2px;
		top: 2px;
		transition: all 0.5s linear;
	}
	.switchOn:after{
		content: 'ON';
		font-size: 12px;
		position: absolute;
		left:6px;
		top: 4px;
		color: #FFFFFF;
	}
	.switchOn.switchOff{
		background-color: red;
	}
	.switchOn.switchOff em{
		left: 2px;
	}
	.switchOn.switchOff:after{
		content: '';
	}
	.switchOn.switchOff:before{
		content: 'OFF';
		font-size: 12px;
		position: absolute;
		right:5px;
		top: 4px;
		color: #FFFFFF;
	}
</style>
